<template>
	<div>
		<div style="width: 33%;float: left;">
			<el-card shadow="never">
				<div>
					<el-row>
						<el-col :span="24"><el-input @focus="memberList"  placeholder="选择会员"></el-input></el-col>
						<!-- <el-col :span="6"><el-button @click="memberList">选择会员</el-button></el-col> -->
					</el-row>
				</div>
				<br />
				<div>
					<el-card style="background-color: #2E9AFE;">
						<el-row :gutter="10">
							<el-col :span="12">
								<span style="font-weight: 400;font-size: 1.5625rem;color: white;">{{ memberName }}</span>
							</el-col>
							<el-col :span="12">
								<span style="font-weight: 400;font-size:1.5625rem;color: white;">{{ memberNick }}</span>
							</el-col>
						</el-row>
						<br />
						<el-row :gutter="5">
							<el-col :span="6" style="font-weight: 400;font-size: 0.9375rem;color: white;">
								积分
								<div>{{ integral }}</div>
							</el-col>
							<el-col :span="6" style="font-weight: 400;font-size: 0.9375rem;color: white;">
								余额
								<div>{{ balace }}</div>
							</el-col>
							<el-col :span="6" style="font-weight: 400;font-size: 0.9375rem;color: white;">
								消费
								<div>{{ totalConsume }}</div>
							</el-col>
							<el-col :span="6" style="font-weight: 400;font-size: 0.9375rem;color: white;">
								折扣
								<div>{{ defaultDiscount }}</div>
							</el-col>
						</el-row>
					</el-card>
				</div>
				<br />
				<div><MemberSave ref="MemberRecordSaveRef" @getDataM="updateMemberRechargeList"></MemberSave></div>
			</el-card>
		</div>
		<!-- 会员充值记录 -->
		<div style="width: 65%;float: right;">
			<el-card shadow="never"><RechargeRecord ref="RechargeRecordListRef"></RechargeRecord></el-card>
		</div>

		<!-- 会员列表弹出层 -->
		<el-dialog center title="会员列表" :visible.sync="memberListVisile" width="70%" append-to-body><MemberList @getSelectMemberData="memberInfo"></MemberList></el-dialog>
	</div>
</template>

<script>
import MemberSave from './tstorememberrechargerecord-add-or-update.vue';
import MemberList from './memberList.vue';
import RechargeRecord from './tstorememberrechargerecord.vue';
export default {
	components: {
		MemberSave,
		MemberList,
		RechargeRecord
	},
	data() {
		return {
			dataForm: {
				integral: ''
			},
			memberId: '',
			memberListVisile: false,
			memberNick:'',
			memberName:'',
			totalConsume:'',
			balace:'',
			integral:'',
			defaultDiscount:''
		};
	},

	created() {
		this.init();
	},

	methods: {
    updateMemberRechargeList(id){
      console.log("id  "+id)
      this.$nextTick(() => {
        this.$refs.RechargeRecordListRef.init(id)
      })
    },
		memberInfo(row) {
      this.memberId = row.id
			this.memberListVisile = false;
			this.memberNick = row.memberNick;
			this.memberName = row.memberName;
			this.defaultDiscount = row.defaultDiscount;
			//获取会员账户详情
			this.$http({
				url: this.$http.adornUrl(`/store/tstorememberaccountdetail/info/` + row.id),
				method: 'get',
				params: this.$http.adornParams()
			}).then(({ data }) => {
				if (data && data.code === 0) {
					this.dataForm.integral = data.tStoreMemberAccountDetail.integral;
					this.dataForm.balace = data.tStoreMemberAccountDetail.balace;
					this.dataForm.totalConsume = data.tStoreMemberAccountDetail.totalConsume;
					this.dataForm.updateTime = data.tStoreMemberAccountDetail.updateTime;
					this.dataForm.updateMan = data.tStoreMemberAccountDetail.updateMan;
					this.dataForm.remark = data.tStoreMemberAccountDetail.remark;
					this.integral = data.tStoreMemberAccountDetail.integral;
					this.balace = data.tStoreMemberAccountDetail.balace;
					this.totalConsume = data.tStoreMemberAccountDetail.totalConsume;
				}
			});

			this.$nextTick(() => {
				this.$refs.MemberRecordSaveRef.init(row);
			});
			//会员充值记录
			this.$nextTick(() => {
				this.$refs.RechargeRecordListRef.init(row.id);
			});
		},

		//获取会员列表
		memberList() {
			this.memberListVisile = true;
		},

		init() {
			this.memberNick = ''
			this.memberName = ''
			this.defaultDiscount = ''
			this.integral = ''
			this.balace = ''
			this.totalConsume = ''
      this.$nextTick(() => {
        this.$refs.MemberRecordSaveRef.clearData();
      })
      //会员充值记录
      this.$nextTick(() => {
        this.$refs.RechargeRecordListRef.init(null);
      });
		}
	}
};
</script>

<style></style>
